<script lang="ts" setup>
import { message } from 'ant-design-vue';
import type { IAddProduct } from '@/types/request';

const { formState } = defineProps<{
  current: number
  teachers: any
  formState: IAddProduct
}>()

// 执行更改props的方法
const emits = defineEmits<{
  (e: 'update:current', value: number): void
}>()

// 下一步
function handleNext() {
  for (const _item in formState) {
    const item = _item as keyof typeof formState
    if (!formState[item]) {
      message.error('请填写完整信息')
      return
    }
  }
  emits('update:current', 1)
}
</script>

<template>
  <div>
    <a-form-item label="标题">
      <a-input v-model:value="formState.title" />
    </a-form-item>
    <a-form-item label="简介">
      <a-textarea v-model:value="formState.detail" />
    </a-form-item>
    <div grid="~ rows-2 cols-2" gap="x-100">
      <a-form-item label="讲师">
        <a-select v-model:value="formState.teacher_id">
          <a-select-option v-for="teacher in teachers" :key="teacher.name" :value="teacher.id">
            {{ teacher.name }}
          </a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item label="学时">
        <a-input v-model:value="formState.hour" />
      </a-form-item>
      <a-form-item label="原价">
        <a-input v-model:value="formState.old_amount" />
      </a-form-item>
      <a-form-item label="现价">
        <a-input v-model:value="formState.amount" />
      </a-form-item>
      <a-form-item label="网盘">
        <a-input v-model:value="formState.bd_zip_url" />
      </a-form-item>
      <a-form-item label="笔记">
        <a-input v-model:value="formState.note_url" />
      </a-form-item>
    </div>

    <a-form-item label="详情">
      <Editor v-model:content="formState.summary" />
    </a-form-item>
    <div flex justify-end>
      <a-button type="primary" @click="handleNext" style="background-color:#1677ff">下一步</a-button>
    </div>
  </div>
</template>
